<template>
  <div>
    <div id="container" class="map01">
      <img src="#" />
    </div>
    <dl class="map02">
      <dt>
        <h2>
          <router-link to="/tyj/detail">建湖县体育中心</router-link>
        </h2>
        <h3>地址：盐城市建湖县湖中南路888号</h3>
      </dt>
      <dd>
        <a id="telTo" href="tel:0515-86299799">
          <img src="@/assets/images/tel.png" alt="">
          电话
        </a>
        <a id="go">
          <img src="@/assets/images/dh.png" alt="">
          去这里
        </a>
      </dd>
    </dl>
  </div>
</template>

<script>

import * as $ from "@/utils/jquery.min.js";
import "@/utils/maps.js";

export default {
  name: "App",
  mounted() {
    const map = new AMap.Map("container", {
      zoom: 15,
      center: [119.79211,33.448861]
    });

    const marker = new AMap.Marker({
      map: map,
      position: [119.79211,33.448861]
    });

    marker.on("click", function() {
      marker.markOnAMAP({
        position: map.getCurrentPosition
      });
    });

    $("#go").on("click", function() {
      marker.markOnAMAP({
        name: "滨海县体育场馆",
        position: map.getCurrentPosition
      });
    });
  }
};

</script>
<style scoped>
@import "../../assets/sports-bureau/css/base.css";
@import "../../assets/sports-bureau/css/other.css";
</style>
